<!-- 评论 -->
<template>
  <div class="argue-container">
      <el-card shadow="hover" :body-style="{ padding: '0px' }" class="list" v-for="item in 5" :key="item">
          <div class="face">
              <img src="@/images/3.png" alt="" width="60px" height="60px">
          </div>
          <div class="argue">
              <div class="argue-title">
                  <div class="argue-left">
                    <span>jiaiji</span><span>在</span>
                    <span>你的作品</span>
                    <span>中评论</span>
                  </div>
                  <div class="argue-right">
                      <span>1月11日</span>
                  </div>
              </div>
              <div class="argue-con">
                  <span>"好厉害"</span>
              </div>
          </div>
     </el-card>
      
  </div>
</template>

<script>
export default {
  data () {
    return {
    };
  },

  methods: {}
}
</script>
<style lang='scss' scoped>
.argue-container{
   
    .list{
        position: relative;
    height: 100px;
    width:100%;
    margin-top:20px;
    .face{
       position: absolute;
        top:20px;
        left:20px;
        img{
            border-radius: 50%;
        }
    }
    .argue{
        margin-left:100px;
        padding:20px ;
        .argue-title{
            display: flex;
            justify-content: space-between;
            .argue-left{
                font-size:18px;
                letter-spacing: 5px;
            }
            .argue-right{
                font-size:16px;
                letter-spacing: 3px;
                color:#909399;
            }
        }
        .argue-con{
            margin-top:15px;
            font-size:16px;
            letter-spacing: 1.5px;
        }
    }
}
}

</style>